<!DOCTYPE html>
<html lang="zh_CN" xmlns:th="http://www.thymeleaf.org"
      xmlns:shiro="http://www.pollix.at/thymeleaf/shiro">
<meta charset="utf-8">
<head th:include="include :: header"></head>
<body class="gray-bg">
<div class="wrapper wrapper-content ">
    <div class="col-sm-12">
        <div class="ibox">
            <div class="ibox-body">
                <div id="exampleToolbar" role="group" class="t-bar">
                    <button type="button" onclick="add(0)"
                            class="btn btn-primary" title="在根节点下添加菜单">
                        <i class="fa fa-plus" aria-hidden="true"></i>添加
                    </button>
                   <!-- <button type="button" onclick="erweima()"
                            class="btn btn-primary" title="二维码">
                        <i class="fa fa-plus" aria-hidden="true"></i>分享二维码
                    </button>-->


                    <button type="button"
                            class="btn btn-danger" onclick="batchRemove()">
                        <i class="fa fa-trash" aria-hidden="true"></i>删除
                    </button>
                    <button type="button"
                            class="btn btn-warning" onclick="people()">
                        <i class="fa fa-user fa-fw" aria-hidden="true"></i>候选人
                    </button>
                </div>
                <table id="exampleTable" data-mobile-responsive="true">
                </table>
            </div>
        </div>
    </div>
</div>
<div th:include="include::footer"></div>
</body>
<script>
    $(function(){
        loadData();
    });
    function loadData(){
        $("#exampleTable").bootstrapTable({
            method : 'get', // 服务器数据的请求方式 get or post
            url : "title/list", // 服务器数据的加载地址
            striped : true, // 设置为true会有隔行变色效果
            dataType : "json", // 服务器返回的数据类型
            pagination : true, // 设置为true会在底部显示分页条
            // queryParamsType : "limit",
            // //设置为limit则会发送符合RESTFull格式的参数
            singleSelect : false, // 设置为true将禁止多选
            iconSize : 'outline',
            toolbar : '#exampleToolbar',
            // contentType : "application/x-www-form-urlencoded",
            // //发送到服务器的数据编码类型
            pageSize : 10, // 如果设置了分页，每页数据条数
            pageNumber : 1, // 如果设置了分布，首页页码
            search : true, // 是否显示搜索框
            showColumns : true, // 是否显示内容下拉框（选择显示的列）
            sidePagination : "client", // 设置在哪里进行分页，可选值为"client" 或者
            // "server"
            // queryParams : queryParams,
            // //请求服务器数据时，你可以通过重写参数的方式添加一些额外的参数，例如 toolbar 中的参数 如果
            // queryParamsType = 'limit' ,返回参数必须包含
            // limit, offset, search, sort, order 否则, 需要包含:
            // pageSize, pageNumber, searchText, sortName,
            // sortOrder.
            // 返回false将会终止请求
            columns : [//   // 数据类型，详细参数配置参见文档http://bootstrap-table.wenzhixin.net.cn/zh-cn/documentation/
                {
                    checkbox:true
                },
                {
                    title: '竞选标题',
                    field: 'rname'
                },
                {
                    title: '开始时间',
                    field: 'starttime'
                },
                {
                    title: '结束时间',
                    field: 'endtime'
                },
                {
                    title: '限制投票数',
                    field: 'size'
                },
                {
                    title: '状态',
                    field: 'status',
                    formatter:function(value,item,index){
                        if(value==0){
                            var btn = "<span class='btn btn-danger'>未开启</span>";
                        }else if(value==1){
                            var btn = "<span class='btn btn-success'>以开启</span>";
                        }else{
                            var btn = "<span class='btn btn-warning'>已结束</span>";
                        }
                        return btn;
                    }
                },
                {
                    title: '操作',
                    field: 'rid',
                    formatter:function (value,item,index) {
                        var e = '<button type="button" class="btn btn-primary" title="修改" onclick="update('+value+')"><i class="fa fa-edit"></i></button> ';
                        var p = '<button type="button" class="btn btn-danger" title="删除" onclick="del('+value+')"><i class="glyphicon glyphicon-trash"></i></button> ';
                        var f = '<button type="button" class="btn btn-danger" value="生成二维码" onclick="erweima('+value+')"><i class="glyphicon glyphicon-trash">生成二维码</i></button> ';
                        return e + p + f;
                    }
                }
            ]
        })
    }
    function update(rid) {
        layer.open({
            type: 2,
            area: ['900px', '550px'],
            fixed: false, //不固定
            maxmin: true,
            content: '/title/update?rid='+rid
        })
    }
    function add(){
        layer.open({
            type: 2,
            area: ['900px', '550px'],
            fixed: false, //不固定
            maxmin: true,
            content: '/add'
        });
    }
    function erweima(id){
        layer.open({
            type: 2,
            area: ['900px', '550px'],
            fixed: false, //不固定
            maxmin: true,
            content: '/title/erweima?id='+id
        });
    }



    function people(){
        layer.open({
            type: 2,
            area: ['900px', '550px'],
            fixed: false, //不固定
            maxmin: true,
            content: '/title/people'
        });
    }
    function del(rid){
        layer.confirm("确定要删除编号为"+rid+"的数据么？？",
            {bth:["确定","取消"]},
            function(){
                $.post('title/del',{rid:rid},function(p){
                    if(p.code==200){
                        //删除成功
                        layer.msg("删除成功！",{icon:1});
                        $("#exampleTable").bootstrapTable("refresh");
                        /*location.reload();*/
                    }else{
                        //删除失败
                        layer.msg("删除失败！"+p.msg(),{icon:2})
                    }
                },'json')
            }
        );
    }
</script>
</html>